<!DOCTYPE html>
<html>    
    <head>
        <meta charset="utf-8">
        <meta http-equiv="Access-Control-Allow-Origin" content="*">
		<meta http-equiv="content-security-policy">
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta name="apple-mobile-web-app-status-bar-style" content="black">        
        <!-- Path to Framework7 Library CSS-->
        <link rel="stylesheet" href="../../css/framework7.ios.min.css">
        <link rel="stylesheet" href="../../css/framework7.ios.colors.min.css">
        <!-- Path to your custom app styles-->
        <link rel="stylesheet" href="../../css/my-app.css">
    </head>
    <body style="-webkit-text-size-adjust:none;">
    <!-- Status bar overlay for full screen mode (PhoneGap) -->
    <div class="statusbar-overlay"></div>
    <!-- Views -->
    <div class="views">
      <!-- Your main view, should have "view-main" class -->
      <div class="view view-main">
        <!-- Top Navbar-->
        <div class="navbar">
          <div class="navbar-inner">
            <!-- We need cool sliding animation on title element, so we have additional "sliding" class -->
            <div class="center sliding">哇吖·城市探秘</div>
          </div>
        </div>
        <!-- Pages container, because we use fixed-through navbar and toolbar, it has additional appropriate classes-->
        <div class="pages navbar-through">
          <!-- Page, "data-page" contains page name -->
          <div data-page="treasure_hunter_index" class="page" id="treasure_hunter_index">
            <!-- Scrollable page content -->
            <div class="page-content">
                <div id="treasure_hunter_index_content">
                </div>
	            <!-- 加载提示符 -->
				<div class="infinite-scroll-preloader">
				    <div class="preloader"></div>
				</div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <script id="treasure_hunter_index_item" type="text/template">
    		{{#each this}}
                {{#js_compare "this.status == 'VALID'"}}
                <div class="card index_item active" data-actId="{{this.id}}">
                {{/js_compare}}
                {{#js_compare "this.status == 'INVALID'"}}
                <div class="card index_item" data-actId="{{this.id}}">
                {{/js_compare}}
              
                {{#js_compare "this.type == 2"}}
                  <div style="position: absolute;top:-2px;
                              right: -2px;width: 100px;
                              height: 100px;z-index: 99;
                  "><img src='img/neice-icon.png' style="width:100%;"></div>
                {{/js_compare}}
                <div style="background-image:url({{this.bgurl}});
                height: 40vw;background-size: cover;background-position: center;" 
                valign="bottom" class="card-header color-white no-border">
                     {{this.name}}
                </div>
                <div class="card-content">
                  <div class="card-content-inner">
                   <p class="color-gray">{{this.description}}</p>
                  </div>
                </div>
                {{#js_compare "this.status == 'VALID'"}}
                <div class="card-footer"><span class='status' status='VALID'>报名截止：{{this.deadline}}</span></div>
                {{/js_compare}}
                {{#js_compare "this.status == 'INVALID'"}}
                <div class="card-footer"><span class='status' status='INVALID'>报名已截止</span></div>
                {{/js_compare}}
              </div>
             {{/each}}

    </script>
    <script id="treasure_hunter_presentation" type="text/template">
	    <div class="treasure_hunter_presentation_header">
		<!--part1滚动图片-->
		<div  class="swiper-container swiper-treasure-hunter-presentation">
	        <div class="swiper-pagination swiper-pagination-treasure-hunter-presentation"></div>
	        <div class="swiper-wrapper">
	            {{#each images}}
	            <div class="swiper-slide imgslide" style="background-image:url('{{this}}')"></div>
	            {{/each}}
	        </div>
	    </div>
		<!--part2-->
		<div class="bg-white" style="padding:15px 20px 10px 20px;">
			<div class="bold" style="font-size: 20px;">{{name}}</div>
			<div class="color-gray" style="margin-top:10px;">
				<div style="float: left;">已有{{orders}}人报名</div>
				<div style="text-align: right;">共{{maxPersons}}人</div>
			</div>
		</div>
		<!--part3-->
		<div>
			<div class="card" style="margin: 0 0 15px 0;">
				<div class="card-footer" style="justify-content:flex-start;">
					<img src="/img/index/stick.png">
					<span class="size_15 yahei bold color-black">活动时间</span>
				</div>
				<div class="item-text size_13 yahei color-gray" style="padding: 0 0 10px 25px;">
					{{date}}
				</div>
				
				<div class="card-footer" style="justify-content:flex-start;">
					<img src="/img/index/stick.png">
					<span class="size_15 yahei bold color-black">集合地点</span>
				</div>
				<div class="item-text size_13 yahei color-gray" style="padding: 0 0 10px 25px;">
					{{location}}
				</div>					
			</div>		
		</div>	
	   </div>
	   
	   <!-- 活动须知 -->
	   <div class="card" style="margin:0px;">
	     <div class="card-footer" style="justify-content:flex-start;">
			<img src="/img/index/stick.png">
			<span class="size_15 yahei bold color-black">活动须知</span>
		 </div>
		 <div class="item-text size_13 yahei color-gray" style="padding: 0 25px 10px;">
			 {{#each note}}
              <p style="margin:0 0 10px 0">{{this}}</p>
             {{/each}}
		 </div>
	   </div>
       <div class="qrcode" style="height:50px;width:100%;"></div>
    </script>
    
   <script id="treasure_hunter_group_members" type="text/template">
   <div class="swiper-container swiper-treasure-hunter-group-members" style="height:100px;width:180px;">
   	<div class="swiper-pagination swiper-pagination-treasure-hunter-group-members" style="bottom:0;"></div>
    <div class="swiper-wrapper">
      {{#each this}}
         <div class="swiper-slide imgslide" style="background:url('{{this.userIcon}}') no-repeat;background-size:80px 80px;">
            <span style="font-size: 13px;color: #fff;font-weight: bold;text-align: center;
    line-height: 15px;margin: 30px auto 35px;display: block;">{{this.name}}</span>
         </div>
	  {{/each}}
      
    </div>
   </div>
   </script>
   <script id="treasure_hunter_group_one_member" type="text/template">
   <div class="swiper-container swiper-treasure-hunter-group-members" style="height:100px;width:180px;">
   	<div class="swiper-pagination swiper-pagination-treasure-hunter-group-members" style="bottom:0;"></div>
    <div class="swiper-wrapper">
      {{#each this}}
         <div class="swiper-slide imgslide" style="background:url('{{this.userIcon}}') no-repeat;background-size:80px 80px;background-position-x: 50px;">
            <span style="font-size: 13px;color: #fff;font-weight: bold;text-align: center;
    line-height: 15px;margin: 30px auto 35px;display: block;">{{this.name}}</span>
         </div>
	  {{/each}}
      
    </div>
   </div>
   </script>

    <!-- Path to Framework7 Library JS-->
    <script type="text/javascript" src="../../js/framework7.js"></script>
    <!-- 初始化 -->
    <script type="text/javascript" src="../js/init.js"></script>
    <!-- 全局函数 -->
	<script type="text/javascript" src="../js/function.js"></script>
	<!-- 全局事件 -->
	<script type="text/javascript" src="../js/event.js"></script>
	<!-- 页面 -->
	<script type="text/javascript" src="../js/page_index.js"></script>
	<script type="text/javascript" src="../js/page_presentation.js"></script>
	<script type="text/javascript" src="../js/page_choosePrice.js"></script>
    </body>
</html>